body {
  margin: 0;
  background-color: #f5f5f5;
}
a,
a:focus,
a:hover {
  color: inherit;
  outline: none;
  text-decoration: none;
}

// 通用变量
:root {
  --main-height: 40px;
  --main-background: #fff;
  --main-border-radius: 5px;
  --input-width: 350px;
  --input-height: 40px;
  --status-dot-size: 5px;
  --status-dot-margin: 6px;
}

.page-container {
  overflow: auto;
  min-height: 100%;
  box-sizing: border-box;

  // 卡片头部样式
  .el-card__header .header {
    height: var(--main-height);
    line-height: var(--main-height);

    .title {
      margin-left: 20px;
      font-size: 20px;
      font-weight: bold;
    }
  }

  // 状态统一样式
  .status {
    display: flex;
    align-items: center;

    &::before {
      width: var(--status-dot-size);
      height: var(--status-dot-size);
      background: #1dc779;
      border-radius: 50%;
      content: '';
      display: inline-block;
      margin-right: var(--status-dot-margin);
    }
  }

  .stop-status {
    &::before {
      background-color: #bdbdbd;
    }
  }

  // 表单样式
  .form-inline {
    .el-form-item__label {
      height: var(--main-height);
      line-height: var(--main-height);
    }

    .el-input {
      --el-input-width: var(--input-width);
      --el-input-height: var(--input-height);
      // 这里可能需要更具体的样式规则来应用高度和宽度
      // 例如: height: var(--el-input-height); width: var(--el-input-width);
    }

    .el-select {
      --el-select-width: var(--input-width);
      --el-select-height: var(--input-height);
      // 同样需要更具体的样式规则
    }
  }
  // 复选框样式
  .el-checkbox,
  .el-checkbox__label {
    width: 100%;
  }

  // 对话框标题样式
  .el-dialog__header .el-dialog__title {
    font-size: 16px;
    font-weight: 700;
    color: #333;
  }
}
.el-dialog .el-dialog__header {
  font-weight: 700;
  height: 60px;
  line-height: 60px;
  padding: 0 20px;
  color: #333;
}
.el-dialog .el-dialog__body {
  padding: 0 20px;
}
.el-dialog .dialog-footer {
  padding-right: 20px;
}
